.header {
    // border-left: 1px solid #fff;
    position: relative;
    color: #1890ff;
    width: 100%;
    height: 50px;
    font-size: 14px;
    .Title_header {
        height: 50px;
        line-height: 50px;
        background-color:  #fff;
        font-size: 18px;
        box-sizing: border-box;
        float: left;
        width: calc(100% - 350px);
        // font-family: SimHei;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        display: flex;
        align-items: center;
        letter-spacing: 4px;
        .splite {
            width: 1px;
            height: 25px;
            background-color: #fff;
            margin-right: 20px;
        }
        .head_logo_img {
            width: 150px;
            height: 50px;
            padding: 0 5px;
            display: flex;
            align-items: center;
            justify-content: center;
            .Roms {
                width: 120px;
                max-height: 35px;
                float: left;
            }
        }
    }
    .time {
        height: 50px;
        line-height: 70px;
        width: 170px;
        text-align: center;
        float: left;
    }
    .user {
        float: right;
        height: 50px;
        line-height: 70px;
        width: 200px;
        text-align: right;
        padding-right: 20px;
        .loginOut {
            padding-left: 10px;
            color: #333;
            cursor: pointer;
        }
    }
    .header_user {
        float: right;
        height: 50px;
        line-height: 70px;
        width: 120px;
        text-align: right;
        padding-right: 20px;
        cursor: pointer;
        .headLayout {
            margin: 0 10px;
            &:hover {
                .mouseHoverParent{
                    display: block;
                }
            }
        }
        .mouseHoverParent{
            display: none;
            position: absolute;
            right: 5px;top: 41px;
            padding-top: 15px;
            z-index: 1111;
        }
        .mouseHover {
            &:before {
                content: " ";
                border-left: 1px solid #ccc;
                border-top: 1px solid #ccc;
                background: #fff;width: 12px;height: 12px;display: block;
                transform-origin: 50% 50%;transform: rotate(45deg);
                margin: -12px auto 0;
            }
            width: 120px;
            color: #333;
            border: 1px solid #ccc;
            box-shadow: 0 2px 4px #ccc;
            padding: 5px 0;
            background: #fff;
            z-index: 1000;
            p {
                height: 35px;
                line-height: 35px;
                transition: all 0.3s;
                text-align: center;position: relative;z-index: 1;
                font-size: 13px;
                &:hover {
                    background: rgba(52,191,198,.9);
                    color: #fff;
                    i {
                        color: #fff !important;
                    }
                }
            }
        }
        .headalist {
            // border-top: 2px solid #fff0;
            float: left;
            .changeColor {
                width: 40px;
                display: inline-block;
                text-align: center;
                i {
                    font-size: 18px;
                }
            }
            &:hover {
                transition: all 0.3s;
                border-top: 2px solid #fff;
            }
            &.inform_bt {
                margin-left: 10px;
                font-size: 16px;
                padding:  0 5px;
                .bt_image {
                    img {
                        width: 16px;
                        height: 16px;
                    }
                }
            }
        }
    }
    .menuListParent {
        display: flex;height: 46px;width: calc(100% - 150px);margin-left: 150px;
        border-bottom: 2px solid #00D1D0;box-shadow: 0 1px 2px 0 #ccc;
        align-items: flex-end;
        overflow-x: auto;overflow-y: hidden;
        transition: all 0.3s;
        .fold-icon {
            width: auto;
            color: #666;
            font-size: 20px;height: 35px;line-height: 35px;
            padding-right: 15px;
            padding-left: 5px;cursor: pointer;
            &:hover {
                opacity: .8;
                transition: all 0.3s;
            }
        }
        &.max {
            width: calc(100% - 64px);
            margin-left: 64px;
            transition: all 0.3s;
        }
    }
    .menuList {
        flex: 1;color: #fff;
        transition: all 0.3s;
        display: flex;
        flex-wrap: nowrap;
        margin-right: 30px;
        li {
            flex-grow:0;
            flex-shrink:0;
            padding: 0 10px;
            width: 110px;
            text-align: center;
            height: 28px;
            line-height: 28px;
            position: relative;
            top: 0px;
            border: 1px solid #cccccc;
            cursor: pointer;
            background: #ffffff;
            margin-right: 5px;
            font-size: 12px;
            color: #787878;
            // border-top-left-radius: 6px;
            // border-top-right-radius: 6px;
            border-bottom: 0;
            &.active {
                color: #fff;
                background: #3373a9;
                height: 30px;
                top: 0px;
                font-size: 14px;
                &:hover {
                    background: transparent;
                    opacity: 1;
                }
            }
            &:hover {
                background: #f6f6f6;
                transition: all .3s;
                opacity: .7;
            }
            span {
                position: absolute;
                right: 5px;
                top: 7px;
                width: 16px;
                height: 16px;
                line-height: 16px;
                border-radius: 50%;
                &:hover {
                    background: #FF5722;
                    color: #fff;
                    transition: all .3s;
                }
            }
            .FirstPageHome {
                position: absolute;
                font-size: 18px;
                left: 14%;
                top: 6px;
            }
        }
        .closeAll {
            position: absolute;
            color: #999;
            right: 0;
            width: 30px;
            height: 30px;
            text-align: center;
            line-height: 30px;
            display: inline-block;
            cursor: pointer;
            font-size: 18px;
            vertical-align: middle;
            border: 1px solid #f5f5f5;
            background: #fff;
            &:hover {
                transition: all .3s;
                background: #eee;
                .mouseHovercloseAll {
                    display: block;
                }
            }
        }
        .mouseHovercloseAll {
            display: none;
            position: absolute;
            right: -1px;top: 9px;padding-top: 20px;
            z-index: 1111;
            .mouseHover {
                width: 150px;
                color: #333;
                border: 1px solid #ccc;box-shadow: 0 2px 4px #ccc;
                padding: 5px 0;
                background: #fff;
                z-index: 1000;
                p {
                    height: 35px;
                    line-height: 35px;
                    font-size: 12px;
                    transition: all 0.3s;
                    text-align: center;position: relative;z-index: 1;
                    &:hover {
                        background: #f1f1f1;
                    }
                }
            }
        }
        .clearBoth{ clear: both; }
    }
    .editionMessage {
        padding: 15px;
        color: #333;
        h3 {
            font-weight: 400;
            border-bottom: 1px solid #f6f6f6;
            height: 42px;
            line-height: 42px;
        }
        .editionBody {
            padding: 10px;
            background-color: #f5f6fa;
        }
    }
}
